<?php session_start();

include 'php/conn.php';

$beer =  $_GET['id'];

$result = mysql_query("SELECT * FROM beers WHERE beerID=$beer");
while($row = mysql_fetch_array($result))
  {
	  $name = $row['beerName'];
	  $abv = $row['beerABV'];
	  $style = $row['beerStyle'];
	  $desc = $row['beerDescription'];
	  $photo = $row['beerPhoto'];
  }

$userBeers = mysql_query("SELECT beer_id, rating FROM beers_drank WHERE user_id = 2 AND beer_id = $beer");
while($row = mysql_fetch_array($userBeers))
  { 
  	$userBeerId = $row['beer_id']; 
	$rating = $row['rating'];
  }
?><!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<!--VIEWPORT META-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

<title>Beer Ticks Mobile App Beer</title>

<!-- CSS stylesheets -->
    <link type="text/css" href="css/master.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" media="screen" href="css/jquery.scrollbarpaper.css" />
<!--WEBFONTS-->
	<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'/>    
	<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,300' rel='stylesheet' type='text/css'/>
<!--JAVASCRIPT-->
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
	<script type="text/javascript" src="js/jquery.raty.js"></script>
	<script type="text/javascript" src="js/rating.js"></script>
    <script type="text/javascript" src="js/scripts.js"></script>
<script type="text/javascript">
$(document).ready(function() {
		
	
		$('#beerTickBtn').click(function() {
			var rating = $('#beerPageRatingNumber').html();
			if(rating){
				window.location = 'honor.php?id='+<?php echo $beer ?>+'&rating='+rating;
			}
		});
	
});
</script>

    
</head>

<body>
	<!--SITE WRAPPER-->
	<div id="siteWrapper">
		
		<!--BEER WRAPPER-->
		<div id="beerWrapper">

			<!--LEFT WRAPPER-->
			<div id="leftWrapper">
			
				
				<!--BEER IMG-->
				<div id="beerImg"><img src="images/FPO_beer.png" alt="beerTicksBeer"/></div><!--/BEER IMG-->

				<div id="abv"><h4>ABV</h4><p><?php echo $abv; ?>%</p></div>
			</div><!--/LEFT WRAPPER>
			
			<!--RIGHT WRAPPER-->
			<div id="rightWrapper">	
				<!--BEER HEADER-->
				<div id="beerHeader"><h2><?php echo $name; ?></h2>
					<div id="headerLine"><img src="images/underline.png" alt="beerTicks"/></div>
				</div>


				<?php if(!$userBeerId){?>
				<!--BREW RATING-->
				<div class="brewRating" id="beerRating">
					<span class="brewRating" id="beerPageRating"></span><span class="brewRatingNumber" id="beerPageRatingNumber" ></span>
			    </div><!--/BREW RATING-->  
				<?php } else{?>
                <span class="beerPageRatingWrapper"><script type="text/javascript"> document.	write(getStars(<?php echo $rating; ?>));</script></span>
	            <span class="beerRatingNumbers"> <?php echo $rating;?></span>
                
                <?php }?>
			    <!--BEER TYPE-->
			    <div id="beerType"><h3><?php echo $style; ?></h3></div>
			    

				<!--BEER COPY-->
				<div id="beerCopy"><p><?php echo $desc; ?></p></div><!--/BEER COPY-->
			</div><!--/RIGHT WRAPPER-->	
			
			<?php if(!$userBeerId){?>
			<!--TICK IT BTN-->
			<div id="beerTickBtn"><a href="honor.php"><img src="images/btn_tick.png" alt="beerTicksBtn"/></a></div>
			<?php }?>
		</div><!--/BEER WRAPPER-->



	</div><!--/SITE WRAPPER-->

	
	<script type="text/javascript" src="js/scripts.js"></script>
	
	<script type="text/javascript" src="js/jquery.scrollbarpaper.js"></script>
</body>
</html>
